<template>
    <div>   
        <h1>这是Vue3 - Setup的写法</h1>
        <span>
            <input type="text" v-model="num1" >
            +
            <input type="text" v-model="num2">
            =
            {{sum}}

        </span>
    </div>
</template>

<script setup lang="ts">
import {ref,computed} from 'vue'
    const num1 = ref(0)
    const num2 = ref(0)

    const sum = computed(()=>{
        return Number(num1.value) +Number(num2.value)
    })


    const successFN = ()=>{
        console.info("successFN")
    }

    const failFn = ()=>{
        console.info("failFn")
    }

    const callRequest = (mark:boolean)=>{
        return new Promise((resolve,reject)=>{
            console.info("正在发起请求")
            setTimeout(() => {
                if(mark){
                    resolve('')
                }else{
                    reject('')
                }
            }, 1000);
        })
    }

    callRequest(false).then(()=>{
        successFN()
    }).catch(()=>{
        failFn()
    })



</script>

<style lang="scss" scoped>

</style>